<!DOCTYPE html>
<html lang="ko">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<title>멀티미디어</title>
		<!-- 플래쉬 재생용 자바스크립트 -->
		<script type="text/javascript"
			src="http://ajax.googleapis.com/ajax/libs
			/swfobject/2.2/swfobject.js"></script>
		<script type="text/javascript">
			swfobject.embedSWF(
			"multimedia/flash/bird.swf", 
			"bird", "400", "300", "8.0.0" );
		</script>
		<script type="text/javascript">
			swfobject.embedSWF(
			"multimedia/flash/OSplayer.swf", 
			"player1", "400", "300", "8.0.0" );
		</script>
		<script type="text/javascript">
			swfobject.embedSWF(
			"multimedia/flash/player_mp3_1.0.0.swf", 
			"bird", "400", "300", "8.0.0" );
		</script>
	</head>

	<body>
		<h1>멀티미디어</h1>
		<div id="bird">
			<p>새 동영상입니다 - 플래쉬로 제작</p>
		</div>
		<div id="player1"><p>플레이어1</p></div>
		<div id="player2"><p>플레이어2</p></div>
		
		<hr />
		<video src="multimedia/video/puppy.mp4"
			width="400" height="300" preload="auto"
			controls="controls" loop="loop"
			autoplay="autoplay">
			<p>무엇이 재생될까요? 웹동영상입니다</p>
		</video>
		<video src="multimedia/video/puppy.webm"
			width="400" height="300" preload="auto"
			controls="controls" loop="loop"
			autoplay="autoplay">
			<p>무엇이 재생될까요? 웹동영상입니다</p>
		</video>
		<video poster="multimedia/images/puppy.jpg"
			preload="auto" controls="controls">
			<source src="multimedia/video/puppy.mp4" >
			<source src="multimedia/video/puppy.webm" >
		</video>
		
		<hr />
		
		<audio src="multimedia/audio/test-audio.mp3"
		  controls="controls" autoplay="autoplay"
		  loop="loop" preload="auto"></audio>
		
		<audio src="multimedia/audio/test-audio.ogg"
		  controls="controls" autoplay="autoplay"
		  loop="loop" preload="auto"></audio>
		  
		<audio controls="controls" autoplay="autoplay">
			<source src="multimedia/audio/test-audio.ogg" >
			<source src="multimedia/audio/test-audio.mp3" >
		</audio>
		
		<!--
			웹 페이지에 플래시 추가
			플래시 파일 확장자는 swf
			SWFObject 스크립트 사용
		div 요소를 사용해서 동영상이 표시될 영역 지정
		플래시 동영상을 볼 수 없는 사용자에게는 대체 동영상을 보여주거나 p 태그를 사용해서 추가설명을 덧붙여 주면 좋음
		
			비디오 재생하기
			온라인에서 재생 가능한 동영상 형식은 avi, flv, h264, mpeg, ogg, mov, webM, wmv
			브라우저에서 비디오를 재생하려면 별도의 재생기나 플러그인이 필요했었음
			html5에서는 webM이나 mp4 형식의 동영상과 video 태그만 있으면 됨
			플래시 비디오(flv) 형식도 사용가능함
			src, width, height, controls, autoplay, loop
		    poster, preload (none, auto, metadata)
		 
		 	여러 개의 source 태그를 사용하여 다른 비디오 형식의 파일들도 재생 가능
		type 속성은 브라우저에게 비디오 형식을 알려줌
		
			오디오
		웹에서 오디오를 재생하려면 mp3 형식의 파일과 html5의 audio 태그를 사용
			src, preload, autoplay, controls, loop, source 태그로 다중 오디오를 재생 가능
		-->
	</body>
</html>